.mine-index {

	// 背景图片
	.image-bg {
		position: fixed;
		width: 100%;
		height: 100%;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: -1;
	}

	.mine-content {
		padding: 0 36rpx;

		// 头像 - 查看资料按钮
		.top-content {
			margin: 20rpx 0;
			display: flex;
			align-items: center;
			justify-content: space-between;

			.left {
				display: flex;
				align-items: center;
				justify-content: space-between;

				.name-grade {

					.name {
						margin-bottom: 2px;
						color: #25365A;
						font-size: 18px;
						font-family: AlibabaPuHuiTi_2_85_Bold;
					}

					.level_img {
						margin-top: 10px;
						display: flex;
						position: relative;

						.grade-background {
							width: 140rpx;
							height: auto;
						}
						
						.grade {
							position: absolute;
							top: 0;
							left: 56rpx;
							margin-top: 6rpx;
							color: #FFFFFF;
							font-size: 30rpx;
						}
					}
				}
			}

			.right {

				.avatar {
					width: 160rpx;
					height: 160rpx;
				}

				// .button {
				// 	background-color: #FED0C0;
				// 	padding: 10rpx 26rpx;
				// 	border-radius: 50px;
				// 	width: 20px;
				// 	height: 50px;

				// 	.button-text {
				// 		color: #F9561B;
				// 		font-size: 28rpx;
				// 	}
				// }

				// .level-name {
				// 	font-size: 30rpx;
				// 	color: #BD6660;
				// }
			}
		}

		// 显示钱包余额
		.bottom-item {
			margin: 40rpx 30rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;

			.show-item {
				display: flex;
				align-items: center;
				justify-content: space-between;

				.show-item-name {
					color: #999999;
					font-size: 26rpx;
					font-family: AlibabaPuHuiTi_2_55_Regular;
				}

				.show-item-number {
					margin-left: 10rpx;
					font-size: 36rpx;
					font-family: AlibabaPuHuiTi_2_85_Bold;
				}
			}
		}

		// 标题
		.laber-item {
			position: relative;
			color: #404040;
			font-size: 38rpx;
			font-family: AlibabaPuHuiTi_2_85_Bold;
		}
		
		.laber-item::before {
			content: '';
			width: 10rpx;
			height: 30rpx;
			background-color: #F71D1F;
			border-radius: 50rpx;
			display: inline-block;
			margin-right: 18rpx;
			box-shadow: 0px 0px 4rpx #F71D1F;
		}

		// 功能列表
		.button-group {
			margin: 30rpx 0 0 0;
			padding: 30rpx 38rpx 30rpx 38rpx;
			// box-shadow: 0px 2px 5px #dedede;
			border: 1rpx solid #EFEFEF;
			border-radius: 30rpx;
			
			.button-group-bottom {
				display: flex;
				align-items: flex-end;
				justify-content: space-between;
			
				.button-style {
					position: relative;
					display: flex;
					align-items: center;
					flex-direction: column;
					width: calc(25% - 7px);
			
					.button {
						width: 24px;
						height: auto;
					}
			
					.button-text {
						margin-top: 20rpx;
						color: #000000;
						font-size: 24rpx;
					}
			
					.tips {
						background-color: #ff0000;
						width: 25rpx;
						height: 25rpx;
						text-align: center;
						position: absolute;
						top: 0;
						right: 0;
						border-radius: 50%;
						margin-top: -8rpx;
						margin-right: -8rpx;
						padding: 8rpx;
						color: #FFFFFF;
						font-size: 20rpx;
						line-height: 25rpx;
						font-family: PingFang_Bold;
					}
				}
				
				&:nth-of-type(n+2) {
					margin-top: 40rpx;
				}
			}
		}
		
		.button-group-two {
			margin: 30rpx 0 40rpx 0;
			padding: 20rpx 38rpx 30rpx 38rpx;
			// box-shadow: 0px 2px 5px #dedede;
			border: 1rpx solid #EFEFEF;
			border-radius: 30rpx;
			box-sizing: border-box;

			// .button-group-top-content {
			// 	display: flex;
			// 	align-items: center;
			// 	justify-content: space-between;

			// 	.title {
			// 		font-size: 36rpx;
			// 	}

			// 	.order-button {
			// 		display: flex;
			// 		align-items: center;

			// 		.button-text {
			// 			// color: #A6A6A6;
			// 			color: #6a6b71;
			// 			// color: #050505;
			// 			font-size: 26rpx;
			// 			// font-family: PingFang_Medium;
			// 		}

			// 		.in {
			// 			margin-left: 12rpx;
			// 			width: 2.5vw;
			// 			height: auto;
			// 		}
			// 	}
			// }

			.button-group-bottom-two {
				display: flex;
				align-items: flex-end;
				justify-content: space-between;

				.button-style {
					position: relative;
					display: flex;
					align-items: center;
					flex-direction: column;
					width: calc(25% - 7px);

					.button {
						width: 50px;
						height: auto;
					}

					.button-text {
						margin-top: 5px;
						color: #000000;
						font-size: 24rpx;
					}

					.tips {
						background-color: #ff0000;
						width: 25rpx;
						height: 25rpx;
						text-align: center;
						position: absolute;
						top: 0;
						right: 0;
						border-radius: 50%;
						margin-top: -8rpx;
						margin-right: -8rpx;
						padding: 8rpx;
						color: #FFFFFF;
						font-size: 20rpx;
						line-height: 25rpx;
						font-family: PingFang_Bold;
					}
				}
			}

			.button-group-bottom-three {
				display: flex;
				align-items: flex-end;
				justify-content: space-between;

				.button-style {
					position: relative;
					display: flex;
					align-items: center;
					flex-direction: column;
					width: calc(25% - 7px);

					.button {
						width: 50px;
						height: auto;
					}

					.button-text {
						color: #000000;
						font-size: 24rpx;
					}

					.tips {
						background-color: #ff0000;
						width: 25rpx;
						height: 25rpx;
						text-align: center;
						position: absolute;
						top: 0;
						right: 0;
						border-radius: 50%;
						margin-top: -8rpx;
						margin-right: -8rpx;
						padding: 8rpx;
						color: #FFFFFF;
						font-size: 20rpx;
						line-height: 25rpx;
					}
				}
			}
		}

		// .invite {
		// 	margin-bottom: 2vh;
		// 	// cursor: pointer;

		// 	.invite-background {
		// 		width: 100%;
		// 		height: 17vw;
		// 		// cursor: pointer;
		// 	}
		// }

		// .line-button-group {

		// 	.line-button-style {
		// 		display: flex;
		// 		align-items: center;
		// 		justify-content: space-between;
		// 		margin: 8px 3px;
		// 		padding: 10px 0;
		// 		// border-bottom: 2px solid #F4F4F5;
		// 		cursor: pointer;

		// 		.left-content {
		// 			display: flex;
		// 			align-items: center;

		// 			.button {
		// 				width: 7vw;
		// 				height: 7vw;
		// 			}

		// 			.button-text {
		// 				margin-left: 18px;
		// 				color: #686868;
		// 				font-size: 15px;
		// 			}
		// 		}

		// 		.right-content {

		// 			.in {
		// 				width: 3.7vw;
		// 				height: 3.7vw;
		// 			}
		// 		}
		// 	}

		// 	.line-bottom {
		// 		height: 2px;
		// 		background-color: #F4F4F5;
		// 	}
		// }
	}
	
	.bottom-occupy {
		height: 110rpx;
	}
}